<template>
  <div>
    <user-infor></user-infor>
    <div>
      <el-col :span="3">
        <el-menu
          default-active="1"
          class="el-menu-vertical-demo"
          background-color="#545c64"
          text-color="#fff"
          @select="menuSelect"
          :collapse="isCollapse"
          active-text-color="#ffd04b">
          <el-menu-item index="0">
            <i class="el-icon-s-operation"></i>
          </el-menu-item>
          <el-menu-item index="1">
            <i class="el-icon-s-home"></i>
            <span>首页</span>
          </el-menu-item>
          <el-menu-item index="2">
            <i class="el-icon-edit"></i>
            <span>笔记</span>
          </el-menu-item>
        </el-menu>
      </el-col>
    </div>
  </div>
</template>

<script>

import cookieStore from "@/cookieStore/index";
import manage from "@/service/manage";
import userInfor from "@/components/userInfor.vue"

export default {
  name: "manage",
  data() {
    return {
      isCollapse: false //菜单的展开与折叠
    };
  },

  methods: {

    getUserInfor(){
      let that = this;
      manage.getUserInfor().then(res => {
        let data = res.data;
        if(data.code === 200){
          let userInfor = {
            account: "",
            userName: "",
            role: ""
          }
          userInfor.account = data.data.userId;
          userInfor.userName = data.data.userName;
          userInfor.role = data.data.userPwd;
          that.$store.dispatch("SET", userInfor);
        }else{
          cookieStore.removeRole();
          cookieStore.removeToken();
          that.$router.push("/");
          that.$message({message: data.message, type:"error"});
        }
      }).catch(res => {
        cookieStore.removeRole();
        cookieStore.removeToken();
        that.$router.push("/");
        that.$message({message: res.message, type:"error"});
      });
    },

    menuSelect(index){
      console.log("选中",index);
      if(index == 0){
        this.isCollapse = !this.isCollapse;
      }
    }
  },

  activated() {
    this.getUserInfor();
    console.log(89566);
  },

  mounted() {
    this.getUserInfor();
  },
  components: {
    userInfor
  }
}
</script>

<style scoped>

</style>